import { SetVerifyAtom, verifyAtom } from "@/pages/AccountPage/atoms/verify"
import { useAtom } from "jotai"
import { useLocation, useNavigate } from "react-router-dom"
import BaseVerifyType from "@/components/forms/BaseVerifyType"
import { resolveAssetImage } from "@/utils/common"
import Svg from "@/components/base/Svg"
import AssetKey from "custom/asset_key"

const ArrowRightIcon = <Svg src="pages/AccountPage/line_arrow.svg" />

const sleep = (delay: number | undefined) => new Promise((resolve) => setTimeout(resolve, delay))

export default function VeifyType() {
    const navigagte = useNavigate()
    const path = useLocation()
    const [verifyData] = useAtom(verifyAtom)
    const [, setVerifyData] = useAtom(SetVerifyAtom)
    const sendSmsByEmail = async () => {
        console.log("sendSmsByEmail")
        // await sleep(500)
        // const res = {
        //     success: true,
        //     data: {
        //         id: "23472389472398472",
        //     },
        // }
        // if (res.success) {
        setVerifyData({
            ...verifyData,
            // otpId: res?.data?.id,
            type: "forget",
            field: "email",
        })
        // setVerifyData((prev) => ({
        //     ...prev,
        //     // otpId: res?.data?.id,
        //     type: "forget",
        //     field: "email",
        // }))
        //     const sd = getDefaultStore().get(verifyAtom)
        //     console.log("verifyAtom", sd)
        //
        // }
        // return res
        navigagte("/forgetPassword/verify/email")
    }
    const sendSmsByPhone = async () => {
        // console.log("sendSmsByPhone")
        // await sleep(500)
        // const res = {
        //     success: true,
        //     data: {
        //         id: "23472389472398472",
        //     },
        // }
        // if (res.success) {
        setVerifyData({
            ...verifyData,
            // otpId: res?.data?.id,
            type: "forget",
            field: "phone",
        })
        // setVerifyData((prev) => ({
        //     ...prev,
        //     // otpId: res?.data?.id,
        //     type: "forget",
        //     field: "phone",
        // }))
        //
        // }
        // return res
        navigagte("/forgetPassword/verify/phone")
    }
    const columns = [
        //暂时取消邮箱验证码重置密码
        // {
        //     title: "Email Verification",
        //     icon: "pages/AccountPage/item/email.webp" as AssetKey,
        //     arrow: ArrowRightIcon,
        //     onClick: sendSmsByEmail,
        // },
        {
            title: "Phone Verification",
            icon: "pages/AccountPage/item/phone.webp" as AssetKey,
            arrow: ArrowRightIcon,
            onClick: sendSmsByPhone,
        },
    ]
    const goBack = () => {
        if (path?.state?.from === "forgetPassword") {
            navigagte("/loginPassword")
        } else {
            navigagte("/")
        }
    }

    return (
        <BaseVerifyType
            onBack={goBack}
            columns={columns}
        ></BaseVerifyType>
    )
}
